<template>
	<div class="" style="width: 100%;">
		<head-top></head-top>


	
		<div class="table_container" :style="'width: 90%;  overflow: hidden;  height:'+(winHeight/1.2)+'px;'">
			<div style="margin: 5px; display: flex;">
				<span style="font-size: 20px;width: 100px;">日志表 :  </span>
				<div>
					<el-button size="mini" type="success" @click="refleash()">刷新</el-button>
					<el-button size="mini" type="primary" @click="addnew_arrange()">新增</el-button>
				</div>

				<span style="font-size: medium; padding: 10px;">账号:</span>
				<el-select v-model="account_choice" size="small" clearable filterable placeholder="请选择"
					@change="changeaccount_choice()">
					<el-option v-for="item in account_options" :key="item.label" :label="item.label"
						:value="item.value">
					</el-option>
				</el-select>

				<span style="font-size: medium; padding: 10px;">日期:</span>
				<el-select v-model="date_choice" size="small" clearable filterable placeholder="请选择"
					@change="changedate_choice()">
					<el-option v-for="item in date_options" :key="item.label" :label="item.label" :value="item.value">
					</el-option>
				</el-select>

				<span style="font-size: medium; padding: 10px;">server:</span>
				<el-select v-model="server_choice" size="small" clearable filterable placeholder="请选择"
					@change="changedate_choice()">
					<el-option v-for="item in server_options" :key="item.label" :label="item.label" :value="item.value">
					</el-option>
				</el-select>

				<!-- <span style="font-size: medium; padding: 10px;">类型:</span>
				<el-select v-model="type_choice" size="small" clearable filterable placeholder="请选择"
					@change="changedate_choice()">
					<el-option v-for="item in type_options" :key="item.label" :label="item.label" :value="item.value">
					</el-option>
				</el-select> -->

				<span style="font-size: medium; padding: 10px;">关键字:</span>
				<el-input v-model="key_word" @change="changedate_choice()"  style="width: 200px;"></el-input>

			</div>

			<el-table ref="singleTable"  :data="arrange_data.slice((currentPage - 1) * pageSize, currentPage * pageSize)"  height="100%" border size='small' :fit='true'
				:style="'width:'+(screenWidth*1.0)+'px;'" :row-class-name=" tableRowClassNamemoneyout">
				<el-table-column prop="index" label="id" width="50" align></el-table-column>
				
				<el-table-column prop="log_type" label="操作类型" width="150"   align>
					<template slot-scope="scope">
						<el-select v-show="scope.row['status'].indexOf('完成') == -1" size="small" v-model="scope.row['log_type']"
							
							style="" placeholder="请选择"
							@change=" change_cell($event,scope)">
							<el-option v-for="item in type_options" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					    <span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['log_type'] }}</span> 
					</template>
				</el-table-column>
				
				
				<el-table-column prop="kkdate" label="日期" width="120"   align>
					<template slot-scope="scope">
						<el-input  v-show="scope.row['status'].indexOf('完成') == -1"  v-model="scope.row['kkdate']" 
							size="small" placeholder="" @change=" change_cell($event,scope)"></el-input>
						<span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['kkdate'] }}</span> 
					</template>
					
				</el-table-column>
							
				<el-table-column prop="weekday" label="weekday" width="100"   align>
					<template slot-scope="scope">
						<el-select  v-show="scope.row['status'].indexOf('完成') == -1" v-model="scope.row['weekday']" size="small" clearable filterable allow-create
							collapse-tags style="" placeholder="请选择"
							@change=" change_cell($event,scope)">
							<el-option v-for="item in weekday_options" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
						<span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['weekday'] }}</span> 
					</template>
					
				</el-table-column>
				<el-table-column prop="account" label="账户" width="200"   align>
					<template slot-scope="scope">
						<el-select  v-show="scope.row['status'].indexOf('完成') == -1" v-model="scope.row['account']" size="small" allow-create clearable filterable
							 style="" placeholder="请选择"
							@change=" change_cell($event,scope)">
							<el-option v-for="item in account_options" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
						<span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['account'] }}</span> 
					</template>
				</el-table-column>
				<el-table-column prop="server" label="server" width="200"   align>
					<template slot-scope="scope">
						<el-select  v-show="scope.row['status'].indexOf('完成') == -1" v-model="scope.row['server']" size="small" allow-create clearable filterable
							 style="" placeholder="请选择"
							@change=" change_cell($event,scope)">
							<el-option v-for="item in server_options" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
						<span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['server'] }}</span> 
					</template>
				</el-table-column>
				<el-table-column prop="strategy" label="strategy" width="200"   align>
					<template slot-scope="scope">
						<el-select  v-show="scope.row['status'].indexOf('完成') == -1" v-model="scope.row['strategy']" size="small" allow-create clearable filterable
							 style="" placeholder="请选择"
							@change=" change_cell($event,scope)">
							<el-option v-for="item in strategy_options" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
						<span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['strategy'] }}</span> 
					</template>
				</el-table-column>
		
			
				
			
				<el-table-column prop="worker" label="记录人" width="120"   align>
					<template slot-scope="scope">
						<el-select  v-show="scope.row['status'].indexOf('完成') == -1"  v-model="scope.row['worker']" size="small" clearable filterable allow-create
							 collapse-tags style="" placeholder="请选择"
							@change=" change_cell($event,scope)">
							<el-option v-for="item in worker_list" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
						<span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['worker'] }}</span> 
					</template>
					
				</el-table-column>
						
			
				
				<el-table-column prop="log" label="备注" align>
					<template slot-scope="scope">
						<el-input  v-show="scope.row['status'].indexOf('完成') == -1" v-model="scope.row['log']" 
							size="small" placeholder="" @change=" change_cell($event,scope)"></el-input>
						<span  v-show="scope.row['status'].indexOf('完成') != -1" > {{scope.row['log'] }}</span> 
					</template>
				</el-table-column>
				
				



				


				<!-- <el-table-column prop="kkupdatetime" label="更新时间" width="140" align></el-table-column> -->
				<el-table-column prop="status" label="状态" width="120" align>
					<template slot-scope="scope">
						<!-- :disabled="scope.row['status']=='完成' " -->
						<el-select  v-model="scope.row['status']" size="small" collapse-tags style="" placeholder="请选择"
							@change=" change_cell($event,scope)">
							<el-option v-for="item in status_options" :key="item.value" :label="item.label"
								:value="item.value">
							</el-option>
						</el-select>
					
					</template>
				</el-table-column>
				<el-table-column label="操作" :width='90'>
					<template slot-scope="scope">
						<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除
						</el-button>
						<!-- <el-button size="small" type="warning" @click="index(scope.$index, scope.row)">详情</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			
		</div>
		<div style="display: flex; margin-left: 300px ;">
			<el-pagination
			  @size-change="handleSizeChange"  
			  @current-change="handleCurrentChange"  
			  :current-page="currentPage"  
			  :page-sizes="[30, 100, 200]"  
			  :page-size="pageSize"  
			  layout="total, sizes, prev, pager, next, jumper"  
			  :total="arrange_data.length">  
			</el-pagination>  
		</div>
	</div>
</template>

<script>
	import headTop from '@/components/headTop'
	export default {
		data() {
			return {
				checkflag: false,
				core_pos: [],
				pos_index_item: '',
				account_choice: "",
				account_options: [],
				target_pos_index_options: [],
				date_choice: "",
				date_options: [],
				tableData: [],
				currentRow: null,
				type_choice:'运维',
				
				inoutflag:false,
				key_word:'',
				server_choice:'',
				count: 0,
				exchange_detail: [],
				LP_account_list: [],
			
				fix_account: {},
				visible: false,
				visible2: false,
			

				screenWidth: document.body.clientWidth, // 屏幕尺寸
				screenHeight: document.body.clientHeight, // 屏幕尺寸
				logindex: "0",
				arrange_data: [],

			
				
				weekday_options:[
				{value: '周一',label: '周一'},
				{value: '周二',label: '周二'},
				{value: '周三',label: '周三'},
				{value: '周四',label: '周四'},
				{value: '周五',label: '周五'},
				{value: '周六',label: '周六'},
				{value: '周日',label: '周日'},
				
				],	
				// worker_list:[
				// 	{
				// 		value: '朱秀鹏',
				// 		label: '朱秀鹏'
				// 	},
					
				// 	{
				// 		value: '游雄凯',
				// 		label: '游雄凯'
				// 	},
				// 	{
				// 		value: '胡睦',
				// 		label: '胡睦'
				// 	},
				// 	{
				// 		value: '梁智博',
				// 		label: '梁智博'
				// 	},
					
				// ],
				status_options: [{
						value: '待处理',
						label: '待处理'
					},

					{
						value: '异常',
						label: '异常'
					},
					{
						value: '完成',
						label: '完成'
					},
					{
						value: '准备',
						label: '准备'
					},

				],
				type_options: [
					{
						value: '低影响',
						label: '低影响'
					},
					{
						value: '运维',
						label: '运维'
					},
					
				],
				server_options: [],
				strategy_options: [],
	            currentPage: 1,  
				pageSize: 50  
			}
		},
		components: {
			headTop,
		},



		activated() {

			// console.log("当前登入用户", this.$store.state.adminInfo.name);
			//    if (this.tradesysPermission_list.indexOf (this.$store.state.adminInfo.permission) ==-1) {
			// 	console.log(this.$store.state.adminInfo.name,"未登入")
			// 	this.$message({type: 'error',	message: '没有权限',});
			// 	this.$router.push({
			// 		path: `/manage`
			// 	})
			// }
		},
		created() {
			this.get_tradesys_account()
			this.get_exchange_arrange()
			this.get_date_last()
		},
		computed: {
			
		},

		methods: {
			changedate_choice() {

				this.get_exchange_arrange()
			},
			handleSizeChange(val) {  
			      this.pageSize = val;  
			      this.getCurrentPageData();  
			},  
			handleCurrentChange(val) {  
			  this.currentPage = val;  
			  this.getCurrentPageData();  
			},  
			// 示例方法，实际使用时不需要（除非你需要基于页码和每页条数从服务器获取数据）  
			getCurrentPageData() {  
			  // 这里只是示例，实际项目中你可能需要发送请求来获取对应页的数据  
			  // 例如：this.fetchData(this.currentPage, this.pageSize).then(response => { this.tableData = response.data; });  
			} ,
			changeaccount_choice() {
				this.get_exchange_arrange()
			},
			change_cell($event, scope) {
				// console.log(scope.$index)
				var that = this
				console.log(scope)
				var arrange_data_item= this.arrange_data[scope.$index]
				if (scope.column['label']=='账户'){
					for (var i = 0; i < that.LP_account_list.length; i++) {
						if( that.LP_account_list[i]['account']==this.arrange_data[scope.$index]['account']){
							this.arrange_data[scope.$index]['account_zw']=that.LP_account_list[i]['account_zwname']
						};
					}
				
				}
				
				



				let sql2 = "UPDATE `LP_account_log` SET \
					`account_zw` = '" + arrange_data_item['account_zw'] + "', `date` = '" + arrange_data_item['kkdate'] + "', \
					`account` = '" + arrange_data_item['account'] + "', \
					`log_type` = '" + arrange_data_item['log_type'] + "',   \
					`time` = '" + arrange_data_item['time'] + "', \
					`worker` = '" + arrange_data_item['worker'] + "',  \
					`weekday` = '" + arrange_data_item['weekday'] + "',  \
					`server` = '" + arrange_data_item['server'] + "',  \
					`strategy` = '" + arrange_data_item['strategy'] + "',  \
					`log` = '" + arrange_data_item['log'] + "' ,`status` = '" + arrange_data_item['status'] + "'\
					WHERE `index` = " + arrange_data_item['index'] + ";"

				that.$axios.post(that.lpapi2, "form=do_sql&sql=" + sql2).then(response => {
					console.log(response, 'do_sql');
					if (response.status = 200) {
						this.$message({
							message: '更新',
							type: 'success'
						});
						// this.get_exchange_arrange()
					} else {
						return
						console.log(response.data.statusCode);
					}
				})




				// }).catch(() => {
				// 	that.$message({
				// 		type: 'info',
				// 		message: '已取消修改'
				// 	});
				// 	that.get_exchange_arrange()
				// });


			},
			
			

			
			handlefixaccount(index, row) {
				console.log("row", row)
				this.fix_account = row
				this.visible2 = true
			},
			handleDelete(index, row) {

				console.log("row", row['index'])
				this.logindex = row['index']
				// this.exchange_arrange=row
				var that = this;

				this.$confirm('此操作将永久修改数据, 是否继续?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',inputType: 'password',
					type: 'warning'
				}).then(() => {


					let sql2 = "delete from `LP_account_log`  WHERE `index`='" + this.logindex + "';"

					that.$axios.post(that.lpapi2, "form=do_sql&sql=" + sql2).then(response => {
						console.log(response, 'do_sql');
						if (response.status = 200) {
							this.$message({
								message: '删除完成',
								type: 'success'
							});
							this.get_exchange_arrange()
						} else {
							return
							console.log(response.data.statusCode);
						}
					})


				}).catch(() => {
					this.$message({
						type: 'info',
						message: '取消删除'
					});
				});
			},

		
			refleash() {
				this.get_exchange_arrange()
			},
			addnew_arrange() {
				var that = this;
				var date = new Date();
				var seperator1 = "-";
				var year = date.getFullYear();
				var month = date.getMonth() + 1;
				var strDate = date.getDate();
				if (month >= 1 && month <= 9) {
					month = "0" + month;
				}
				if (strDate >= 0 && strDate <= 9) {
					strDate = "0" + strDate;
				}
				 
				var dayOfWeek = date.getDay();  
				var days = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];  
				var dayName = days[dayOfWeek]; 
				
				
				var currentdate = year + seperator1 + month + seperator1 + strDate;
				let sql2 = "INSERT INTO `LP_account_log`(`date`,`status`,`updatetime`,`log`,`log_type`,`worker`,`weekday`) VALUES ('" +
					currentdate + "','准备',CURRENT_TIMESTAMP,'','"+this.type_choice+"','','"+dayName+"');"
				that.$axios.post(that.lpapi2, "form=do_sql&sql=" + sql2).then(response => {
					console.log(response, 'do_sql');
					if (response.status = 200) {
						this.$message({
							message: '新增完成',
							type: 'success'
						});
						this.get_exchange_arrange()
					} else {
						return
						console.log(response.data.statusCode);
					}
				})

			},

			get_date_last() {
				var that = this;
				
				
				let sql =
					" select date_format(date,'%Y-%m-%d') as kkdate ,date from `LP_account_log`  GROUP BY date;"
				that.$axios.post(that.lpapi2, "form=get_data&sql=" + sql).then(response => {
					console.log(response, 'data_tradesys_account');
					if (response.status = 200) {
						that.date_options = []
						//for (var i = 0; i < response.data.length; i++) {
						for (var i = response.data.length - 1; i >= 0; i--) {
							let char = {
								value: response.data[i]['kkdate'],
								label: response.data[i]['kkdate'],
							};
							that.date_options.push(char);
						}
					} else {
						console.log(response.data.statusCode);
					}
				})

			},



			get_tradesys_account() {
				var that = this;
				// console.log(that.lpapi2)

				let sql =
					"select * from `LP_account_list` where check_flag ='yes' ORDER BY account_type  ;"
				that.$axios.post(that.lpapi2, "form=get_data&sql=" + sql).then(response => {

					console.log(response, 'conf_tradesys_account')
					let plat_list = []
					if (response.status = 200) {
						that.account_options = []
						that.LP_account_list = response.data;
						for (var i = 0; i < response.data.length; i++) {
							let char = {
								value: response.data[i]['account'],
								label: response.data[i]['account']+'/'+response.data[i]['account_zwname']+'/'+response.data[i]['program_code'],

							};

							that.account_options.push(char);
							
						    let char2 = {  
								value: response.data[i]['server'],  
								label: response.data[i]['server'],  
							};  
						   
							let exists = that.server_options.some(item => item.value === char2.value);  
						  
							// 如果不存在，则添加到数组中  
							if (!exists) {  
								that.server_options.push(char2);  
							}  
							
							let char3 = {  
								value: response.data[i]['product_strategy'],  
								label: response.data[i]['product_strategy'],  
							};  
						  
							// 检查 account_options 数组中是否已存在具有相同 value 的对象  
							let exists1 = that.strategy_options.some(item => item.value === char3.value);  
						  
							// 如果不存在，则添加到数组中  
							if (!exists1) {  
								that.strategy_options.push(char3);  
							}  
							
						}
						let char = {
							value: 'all',
							label: 'all',

						};

						that.account_options.push(char);


					} else {
						console.log(response.data.statusCode);
					}
				})


			},
			get_exchange_arrange() {
				var that = this;
				console.log(that.lpapi2)
				let sql ="select * ,date_format(date,'%Y-%m-%d') as kkdate,date_format(updatetime,'%Y-%m-%d  %H:%i:%s') as kkupdatetime \
				from `LP_account_log` where   server like  '%" + this.server_choice + "%'  and \
				account like '%" + this.account_choice + "%'  \
				 ORDER BY date desc,time  limit 300;"
				 if(this.date_choice.length>2){
				 	sql ="select * ,date_format(date,'%Y-%m-%d') as kkdate,date_format(updatetime,'%Y-%m-%d  %H:%i:%s') as kkupdatetime \
				 	from `LP_account_log` where   server like  '%" + this.server_choice + "%'  and \
				 	account like '%" + this.account_choice + "%'    and date = '" + this.date_choice +"'\
				 	 ORDER BY date desc,time  limit 300;"
				 	
				 }
				if(this.key_word.length>0){
					 sql ="select * ,date_format(date,'%Y-%m-%d') as kkdate,date_format(updatetime,'%Y-%m-%d  %H:%i:%s') as kkupdatetime \
				from `LP_account_log` where  account like '%25" + this.key_word + "%25' and  log like '%25" + this.key_word + "%25'  ORDER BY date desc,time  limit 300;"
					
				}
				
				
				
				
				that.arrange_data = []
				that.$axios.post(that.lpapi2, "form=get_data&sql=" + sql).then(response => {

					console.log(response.data[0], 'LP_account_log')

					if (response.status = 200) {
						if (response.data[0].hasOwnProperty('message')) {
							that.arrange_data = []
						} else {
							that.arrange_data = response.data;
						}
						// that.arrange_data = response.data;
					} else {
						console.log(response.data.statusCode);
					}
				})


			},




			
			tableRowClassNamemoneyout({
				row,
				rowIndex
			}) {
		
				if (this.arrange_data[rowIndex]['status'] == '待处理' | this.arrange_data[rowIndex]['status'] == '准备' ) {
					return 'bacorange';
				}
				if (this.arrange_data[rowIndex]['status'] == '异常') {
					return 'bacOrangeRed';
				}
				return '';
			}

		},
	}
</script>

<style>
	.el-table .bacOrangeRed {
		background: OrangeRed;
	}

	.el-table .bacorange {
		background: orange;
	}

	.el-table .success-row {
		background: grey;
		color: white;
	}

	.table_container {
		margin: 20px 5%;
		/* background-color: #0000FF; */
	}

	.el-table .grey {
		background: Silver;
	}

	.el-table .DarkGray {
		background: DarkGray;
	}

	.el-table .LightCoral {
		background: LightCoral;
		color: white;
	}

	.el-table .LimeGreen {
		background: LimeGreen;
	}

	.el-table .green {
		background: green;
	}

	.el-table .LightSlateGray {
		background: LightSlateGray;
	}

	.el-table .red {
		background: red;
		color: white;
	}

	.el-table .orange {
		background: NavajoWhite;
		color: black;
	}

	.el-table .blue {
		background: blue;
	}

	.el-table .purple {
		background: Violet;
		color: black;
	}

	.el-table .LightSteelBlue {
		background: LightSteelBlue;
	}

	.el-table .Goldenrod {
		background: Goldenrod;
	}

	.el-table .xingmu {
		background: Goldenrod;
		color: red;
		font-weight: bold;

	}


	.el-table .black {
		background: black;
		color: white;
	}

	.el-table .green {
		background: green;
		color: white;
	}

	.el-table .CornflowerBlue {
		background: CornflowerBlue;
		color: white;
	}

	.el-table .DodgerBlue {
		background: DodgerBlue;
	}
</style>
